<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<!DOCTYPE HTML>
<html lang="en-US">
<head>
	<link rel="stylesheet" type="text/css" href="css/bootstrap.min.css"/>
	<script type="text/javascript" src="js/jquery.js"></script>
	<script type="text/javascript" src="js/bootstrap.min.js"></script>
	<meta charset="UTF-8">
	<title>新建项目</title>
	<style type="text/css">
		body{
			background-image:url(img/bb.jpg);
			background-repeat:repeat-x;
		}
		#proname{
			color:red;
		}
	</style>
	
</head>
<body>
	<%@ include file="include/main-top.jsp" %>
	<div class="container">
		<h2>新建项目</h2>
		<!-- 这是提交成功后,返回10000的话即提示成功 -->
		<c:if test="${param.state == '10000' }">
			<div id="addemp" class="alert alert-info fade in" >
	            <a href="#" data-dismiss="alert" class="close">×</a>
	            <strong>恭喜您,添加新项目成功!</strong>
	        </div>
		</c:if>
		<!-- 这是项目名称为空的话,即提示项目名称不能为空 -->
		<div id="msg" class="alert alert-error fade in" style="display:none" >
            <a href="#" data-dismiss="alert" class="close">×</a>
            <strong>error!项目名称不能为空!</strong>
        </div>
        <div id="msg1" class="alert alert-error fade in" style="display:none" >
            <a href="#" data-dismiss="alert" class="close">×</a>
            <strong>error!负责人不能为空!</strong>
        </div>
		<hr />
		<form class="form-horizontal" action="addpro.jspx" method="post">
	        <fieldset>
	          <div class="control-group">
		            <div class="controls">
						<label><h3>项目名称</h3></label>
		              <input type="text" id="pname" class="input-xlarge" name="name">
		              <span id="proname">*</span>
		            </div>
	          </div>
	          <div class="control-group">
				 <div class="control-group">
		            <div class="controls">
					<label><h3>项目描述</h3></label>
		              <textarea rows="5" id="textarea" class="input-xlarge" name="desc"></textarea>
		            </div>
	         	 </div>
	             <div class="controls">
				 <label><h3>负责人</h3></label>
				 
		              <select id="select01" name="peid" id="option">
		             	<option>--请选择负责人--</option>
		                  <!-- 这里在后面的Servlet中应该取得的是选中的那个人的ID吧,并不是传过去session的id -->
		                  <c:forEach var="el" items="${employeeList}">
		                  	<option  value="${el.id}" > ${el.username} </option>
		                  </c:forEach>
		              </select>
		              <span id="proname">*</span>
	              </div>
	          </div>
	          <div class="control-group" style="margin-top:70px">
	            <div class="controls">
					<label><h3>项目成员</h3></label>
	                	<!-- 在此迭代的是雇员 -->
			                <c:forEach var="el" items="${employeeList}">
								<input type="checkbox" name="pe" value="${el.id }"/>${el.username }<br/>
			                </c:forEach>
	             </div>
	          </div>
	          <div class="form-actions">
	          <span id="proname">注：带*的必须填写!</span>
	            <button id="addprobtn" class="btn btn-primary" type="submit" style="margin-left:60px">保存</button>
	            <a href="main.jspx" class="btn">返回</a>
	          </div>
	        </fieldset>
        </form>
	</div>  
	<script type="text/javascript">
		$(document).ready(function(){
			$('#addprobtn').click(function(){
				if($('#pname').val() == "" || $('#pname').val() == null){
					$('#msg').show();
					$('#pname').focus();
					return false;
				}
				
			});
			$('#pname').keydown(function(){
				$('#msg').hide();
			});
			
		});
	</script>	  
</body>
</html>